<!-- START DEFAULT DATATABLE -->
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">管理维修人员</h3>
        <ul class="panel-controls">
            <li><a href="/admin/repair/editRepairPerson.jspa?page=${param.page}"><i class="fa fa-plus"></i></a></li>
        </ul>
    </div>
    <div class="panel-heading">
        <form action="/admin/repair/manageRepairPersons.jspa" id="qForm">
            <div class="row">
                <div class="col-md-2">
                    <select class="form-control select" id="categoryId" name="categoryId">
                        <option value="-1">全部维修分类</option>
                        <c:forEach var="par" items="${categoryRepository.findByParentId(0)}">
                            <option value="${par.id}"
                                    <c:if test="${param.categoryId==par.id}">selected</c:if>>${par.name}</option>
                        </c:forEach>
                    </select>
                </div>
                <div class="col-md-2">
                    <select class="form-control select" id="qField" name="qField">
                        <option value="name" ${param.qField=="name"?"selected":""}>按姓名</option>
                        <option value="mobile" ${param.qField=="mobile"?"selected":""}>按手机号</option>
                    </select>
                </div>
                <div class="col-md-3">
                    <div class="input-group">
                        <input class="form-control" type="text" id="qVal" name="qVal" value="${param.qVal}"/>
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-info" onclick="searchUser()">搜索</button>
                    </span>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="panel-body">
        <table class="table">
            <thead>
            <tr>
                <th>姓名</th>
                <th>手机号</th>
                <th>维修分类</th>
                <th>职务</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${persons}" var="user">
                <tr class="foo" id="${user[0]}">
                    <td>${user[1]}</td>
                    <td>${user[2]}</td>
                    <td>${user[3]}</td>
                    <td>${user[4]}</td>
                    <td>
                        <button class="btn btn-info btn-rounded btn-sm" title="编辑维修人员"
                                onclick="goEdit(${user[0]})"><span
                                class="fa fa-pencil"></span></button>
                        <button class="btn btn-danger btn-rounded btn-sm" title="删除维修人员"
                                onClick="delete_row(${user[0]});"><span
                                class="fa fa-times"></span></button>

                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
        <c:out value="${pagingString}" escapeXml="false"/>
    </div>

</div>
<!-- END DEFAULT DATATABLE -->

<!-- MESSAGE BOX-->
<div class="message-box animated fadeIn" data-sound="alert" id="mb-remove-row">
    <div class="mb-container">
        <div class="mb-middle">
            <div class="mb-title"><span class="fa fa-times"></span> <strong>删除该维修人员</strong> ?</div>
            <div class="mb-content">
                <p>你确定要删除这个维修人员吗？</p>

                <p>本次操作将无法撤销。</p>
            </div>
            <div class="mb-footer">
                <div class="pull-right">
                    <button class="btn btn-success btn-lg mb-control-yes">确定</button>
                    <button class="btn btn-default btn-lg mb-control-close">取消</button>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END MESSAGE BOX-->

<!-- START SCRIPTS -->
<script>
    function goEdit(o) {
        window.location.href = '/admin/repair/editRepairPerson.jspa?go=' + encodeURIComponent("manageRepairPersons.jspx?page=${param.page}")
                + '&page=${param.page}&id=' + o;
    }
    var users = [];
    function selectItem(o) {
        if ($('#' + o).hasClass("success")) {
            $('#' + o).removeClass("success");
        } else {
            $('#' + o).addClass("success");
        }
    }


    function delete_row(row) {
        var param = {};
        param.id = row;
        var box = $("#mb-remove-row");
        box.addClass("open");
        box.find(".mb-control-yes").on("click", function () {
            json("/admin/repair/delRepairPerson.jspx", param, function (data) {
                box.removeClass("open");
                $("#" + row).hide("slow", function () {
                    $(this).remove();
                });
            });
        });
    }


    function searchUser() {
        $('#qForm').submit();
    }

</script>



